<script setup lang="ts">
import { getVisitCount } from '@/api/log';
import { onMounted, ref } from 'vue';

const count = ref(0);

onMounted(() => {
    getVisitCount().then((res) => {
        count.value = res.data;
    })
})

</script>

<template>
    <div class="container">
        <div class="row">
            <el-text style="font-size: 15px;font-weight: bolder;">访问次数</el-text>
            <el-text style="font-size: 15px;font-weight: bolder; color: brown;">月</el-text>
        </div>
        <div class="row-2">
            <el-text style="font-size: 15px;font-weight: bolder;">{{ count }}</el-text>
        </div>
    </div>
</template>

<style lang="scss" scoped>
.container {
    background-color: white;
    .row {
        height: 50%;
        width: 100%;
        display: flex;
        justify-content: space-between;
        padding: 10%;
        border-bottom: 1px solid rgba(107, 106, 106, 0.418);
    }
    .row-2 {
        height: 50%;
        display: flex;
        justify-content: center;
    }
}
</style>